<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <script>
        const getJSON = function (url){
            return new Promise((resolve,reject) => {
                const xhr = new XMLHttpRequest();
                xhr.open('GET',url);
                xhr.onreadystatechange = handler;
                xhr.responseType = 'json';
                xhr.setRequestHeader('Accept','application/json');
                xhr.send();
                function handler(){
                    console.log(this);
                    if(this.readyState === 4){
                        if(this.state === 200){
                            resolve(this.response);
                        }else{
                            reject(new Error(this.statusText));
                        }
                    }
                }
            })
        }
        getJSON('http://css.sf-team.cn')
            .then((val) => {
                console.log(val);
            },(err) => {
                console.log(err);
            });

        // then() 方法
        // then() 第一个参数是relove回调函数，第二个参数是可选的reject的回调函数
        // then() 返回一个新的promise实例,可以采用链式编程

        let a = getJSON('http://css.sf-team.cn')
            .then((data) => {
                return data[0];
            }).then((obj) => {
                console.log("cs:"+obj);
            });
        console.log(a);

        getJSON('http://css.sf-team.cn')
            .then((data) => {
                console.log(data);
            }).catch((err) => {
            console.log(err);
        });

    </script>
</body>
</html>